<template>
  <div class="demo-type1">

    <el-card class="box-card">
      <el-avatar :size="60" src="https://empty" @error="errorHandler">
        <img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png" />
      </el-avatar>
      <div slot="header" class="clearfix">
        <span style="float: left;">店铺信息</span>
        <el-button style="float: right; padding: 3px 0" type="text">上传头像</el-button>
      </div>
      <div class="text item" style="text-align: left; margin-top: 10px;">
        店铺编号:{{business.id}}
        <el-button type="primary" icon="el-icon-edit" circle class="b1"></el-button>
      </div>
      <div class="text item" style="text-align: left;margin-top: 10px;">
        店铺简介:{{business.summary}}
        <el-button type="primary" icon="el-icon-edit" circle class="b1"></el-button>
      </div>
      <div class="text item" style="text-align: left; margin-top: 10px;">
        销量:{{business.sold}}
        <el-button type="primary" icon="el-icon-edit" circle class="b1"></el-button>
      </div>
    </el-card>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        business: []
      }
    },
    mounted: function() {
      this.loadGoods()
    },
    methods: {
      errorHandler() {
        return true
      },
      loadGoods() {
        this.$axios.get('/getBusiness').then(resp => {
          this.business = resp.data
        })
      }
    }
  }
</script>
<style>
  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 30px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }

  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 50%;
  }

  .b1 {
    float: right;
  }

  .demo-type1 {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
</style>
